body {
  width: 10rem;
  height: 100%;
  background-image: url("//s-sdk.szmengqukj.com/web/squeeze/img24_24/bg.jpg");
  background-size: 10rem auto;
  background-repeat: no-repeat;
  background-color: #fa4323;
}

.upper-box {
  width: 10rem;
  height: 11.4667rem;
  position: relative;
}

/* 六要素 */
.lysTop {
  font-size: 0.2667rem;
}

/* swiper */
.swiper-box {
  position: absolute;
  top: 48%;
  left: 50%;
  transform: translateX(-50%);
}
.mySwiper {
  background-color: #fa4323;
  color: #ffffff;
  width: 7.5rem;
  height: 0.8rem;
  border-radius: 0.8rem;
}

.swiper-slide {
  font-size: 0.3467rem;
  text-align: center;
  line-height: 0.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.swiper-slide img {
  width: 0.48rem;
  height: 0.48rem;
  color: #fff;
}

.swiper-slide-text1 {
  padding: 0 0.1333rem;
}
.swiper-slide-text3 {
  padding-left: 0.1333rem;
}

/* 抽奖内容 */
.sudoku_container {
  position: relative;
  bottom: -42%;
  margin: auto;
  width: 10rem;
  height: 10.6rem;
  background-image: url("//s-sdk.szmengqukj.com/web/squeeze/img24_24/Lottery-box.png");
  background-size: 10rem 10.6rem;
  background-repeat: no-repeat;
}

.prize_box {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: -100;
  width: 9rem;
  height: 8rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: center;
}

.row {
  display: flex;
  justify-content: space-between;
}

.row_gift {
  width: 2.4rem;
  height: 2.4rem;
  background: #fff;
  border-radius: 0.2133rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 2px solid #feae59;
  box-shadow: 2px 3px 2px #feae59;
}

.lottery-btn {
  width: 2.4rem;
  height: 2.4rem;
  border-radius: 0.2133rem;
}

.row_gift img {
  width: 1.6rem;
  height: 1.6rem;
  margin-top: 0.2rem;
}

.row_gift div {
  width: 100%;
  height: 0.8rem;
  color: #000;
  font-size: 0.35rem;
  font-weight: 600;
  text-align: center;
}

#prize_8,
#sudoku_btn img {
  margin-top: 0;
  width: 2.4rem;
  height: 2.4rem;
}

/* 抽奖按钮 */
#sudoku_btn {
  position: absolute;
  top: 55%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
}

.row_gift_isactive {
  background: #fffa7d;
}

/* 描述 */
.activity-desc {
  position: absolute;
  top: 140%;
  left: 50%;
  transform: translateX(-50%);
  padding-bottom: 2rem;
}

.activity-desc-title {
  width: 100%;
  height: 0.8rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.activity-desc-title div {
  font-size: 0.4267rem;
  text-align: center;
  color: #fff;
  width: 2.4rem;
  line-height: 0.8rem;
}

.activity-desc-title img {
  width: 2.4rem;
  height: 0.3rem;
}

.activity-desc-content {
  background-color: #fa4323;
  width: 8.6rem;
  /* height: 8rem; */
  border: 0.03rem dashed white;
  border-radius: 0.1rem;
  color: #fff;
  font-size: 0.3733rem;
  line-height: 1.5;
  padding: 0.2667rem 0.2667rem;
}

/* 遮罩层 */
.mark {
  background-color: rgba(0, 0, 0, 0.8);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 998;
}

.mark-box {
  width: 9rem;
  height: 10rem;
  margin: 0 auto;
  position: relative;
  top: 50%;
  transform: translateY(-75%);
  z-index: 999;
}

.mark-position {
  position: absolute;
  top: 45%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mark-box-1 {
  width: 8.93rem;
  height: 7.92rem;
  top: 37%;
}

.mark-content {
  width: 5.87rem;
  height: 5.87rem;
}

.mark-box-2,
.mark-box-3 {
  width: 100%;
  height: 100%;
}

.mark-prize {
  width: 3.2rem;
  height: 3.2rem;
  position: absolute;
  top: 35%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.mark-prize-countdown {
  width: fit-content;
  height: 0.45rem;
  color: #d26500;
  /* color: #fff; */
  font-size: 0.32rem;
  position: absolute;
  top: 63%;
  left: 50%;
  transform: translateX(-50%);
}

.mark-prize-name {
  font-size: 0.64rem;
  font-weight: 600;
  color: #d10300;
  /* color: #fff; */
  position: absolute;
  top: 78%;
  left: 50%;
  transform: translateX(-50%);
  width: max-content;
}

.mark-go {
  width: 5.65rem;
  height: 1.28rem;
  position: absolute;
  top: 83%;
  left: 50%;
  transform: translateX(-50%);
}

.mark-go-text {
  width: 5.23rem;
  height: 0.88rem;
  font-size: 0.4rem;
  color: #ffffff;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 18%;
  left: 50%;
  transform: translateX(-50%);
}

.mark-go-text img {
  width: 0.37rem;
  height: 0.37rem;
}

/* 返回弹窗 */
.back-box {
  width: 9rem;
  height: 10rem;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 999;
}

.back-box-1 {
  width: 14.2213rem;
  height: 12.6053rem;
  top: 37%;
}

.back-position {
  position: absolute;
  top: 45%;
  left: 58%;
  transform: translate(-50%, -50%);
}

.back-prize {
  width: 2rem;
  height: 2;
  position: absolute;
  top: 30%;
  left: 56%;
  transform: translateX(-50%);
}

.back-prize-name {
  font-size: 0.32rem;
  font-weight: 600;
  color: #d10300;
  position: absolute;
  top: 51%;
  left: 56%;
  transform: translateX(-50%);
  width: max-content;
}

.click-down {
  width: 5.3333rem;
  height: 1.6rem;
  position: absolute;
  left: 56%;
  bottom: 16%;
  transform: translateX(-50%);
}

.close-back-box {
  width: 0.72rem;
  height: 0.72rem;
  border: 1px solid #ccc;
  font-size: 0.72rem;
  text-align: center;
  line-height: 0.72267rem;
  border-radius: 0.72267rem;
  color: #ccc;
  position: absolute;
  bottom: 0%;
  left: 56%;
  transform: translateX(-50%);
}
